<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>十五二十</title>
    <link href="css/mui.min.css" rel="stylesheet" />
    <link rel="stylesheet" href="css/aui.css"/>
    <link rel="stylesheet" href="css/shop.css">
    <link rel="stylesheet" href="css/alert.css">
    <script src="js/jquery-1.8.2.min.js"></script>
    <script src="js/mui.min.js"></script>
    <script>
        autoload=function(){
            var data={};
            data.user_id=user_id;
            data.roomid=localStorage.roomid;
            console.log('id='+data.user_id);
            $.ajax({
                type: "POST",
                //url: "http://test/jsonp.php",
                data: data,
                url: "http://xjh.taoleyizhan.com/wap/index.php?ctl=mainpage&act=fiter",
                dataType: "json",
                success: function (json) {
                    console.log(json);
                    page_data=json;
                    $(".vuser_name").html(json.vsuser.user_name);
                    $(".vuser_id").html(json.vsuser.id);
                    $("#gamewin").html(json.mess.game.name)
                    $("#roomid").html(localStorage.roomid)
                    $(".vt").attr('src',hostUrl+json.vsuser.user_logo)
                    $(".mt").attr('src',hostUrl+json.user.user_logo)
                    $("#gameout").html('-'+(json.mess.game.origin_price*1)/(json.mess.game.max_buy*1)+'积分')
                    $("#gamewin").html(json.mess.game.name)
                    $(".jiutop img").eq(2-json.mywin).hide();
                    $(".jiubottom img").eq(2-json.vswin).hide();
                    var vdw="";
                    switch (json.vsuser.dw){
                        case '1':vdw='初入江湖';break;
                        case '2':vdw='拜师学艺';break;
                        case '3':vdw='小试牛刀';break;
                        case '4':vdw='驾轻就熟';break;
                        case '5':vdw='大显身手';break;
                        case '6':vdw='炉火纯青';break;
                        case '7':vdw='出类拔萃';break;
                        case '8':vdw='技冠群雄';break;
                        case '9':vdw='出神入化';break;
                        case '10':vdw='登峰造极';break;
                        default:vdw='暂无';
                    }
                    $("#vdw").html(vdw);
                    $(".my_name").html(json.user.user_name);
                    $(".my_id").html(json.user.id);
                    var udw="";
                    switch (json.user.dw){
                        case '1':udw='初入江湖';break;
                        case '2':udw='拜师学艺';break;
                        case '3':udw='小试牛刀';break;
                        case '4':udw='驾轻就熟';break;
                        case '5':udw='大显身手';break;
                        case '6':udw='炉火纯青';break;
                        case '7':udw='出类拔萃';break;
                        case '8':udw='技冠群雄';break;
                        case '9':udw='出神入化';break;
                        case '10':udw='登峰造极';break;
                        default:udw='暂无';
                    }
                    $("#udw").html(udw)
                    init();
                },
                error:function(json){
                    console.log(json);
                }
            });
        }

    </script>
    <script src="js/init.js"></script>
    <script>
        var ws;
        var tim3;
        var sendConn=null;
        var reConn=localStorage.reConn;
        var state_begin=0;
        function init() {
            var host = "ws://47.104.8.67:8282";
            try {
                ws = new WebSocket(host);
                ws.onopen = function(){
                    console.log('连接成功');
                    var data={};
                    data.uid=page_data.user.id;
                    data.m="index";
                    data.a="slogin";
                    ws.send(JSON.stringify(data));
                    console.log('发送登陆数据完毕');
                };
                ws.onmessage = function (e) {
                    console.log(e);
                    var data = JSON.parse(e.data);
                    //监听小局上报结果
                    console.log(data);
                    if(data.m=='slogin'){
                        console.log('登录成功');
                        var join={};
                        join.roomid=localStorage.roomid;
                        join.uid=page_data.user.id;
                        if(reConn==1){//此处判定断线重连机制
                            console.log('reconn 运行了 '+reConn);
                            reConn=null;
                            localStorage.reConn=null;
                        }
                        if(sendConn){
                            join.m='Index';
                            join.a='sendConn';
                            sendConn=null;
                            localStorage.reConn=1;
                            ws.send(JSON.stringify(join));
                        }
                        console.log(join);
                        if(data.type=="ping"){
                            var sendData={};
                            sendData.m="index"
                            sendData.a="index"
                            console.log('心跳检测响应')
                            ws.send(JSON.stringify(sendData));
                        }
                    }
                    if(data.m=='winGame'){
                        clearInterval(tim3)
                        var fdata=data.data;
                        $(".play_center_cont").hide();
                        var myshoushi= data.my;
                        var fitshoushi=data.you;
                        donghua(fitshoushi,myshoushi);
                        setTimeout(function () {
                            $(".main_lbj").hide();
                            $(".last_success").show();
                            setTimeout(function () {
                                window.location.href="backpack.html"
                            },4000)
                        },4000)

                    }
                    if(data.m=="go"){
                        clearInterval(tim3);
                        var myshoushi= JSON.stringify(data.my);
                        var fitshoushi=JSON.stringify(data.you);
                        var result1=data.win;
                        console.log(myshoushi);
                        console.log( fitshoushi);
                        console.log( data.win);
                        $(".huihe_num").html(data.data.screen);
                        donghua(data.you,data.my);
                        setTimeout(function() {
                            console.log(result1);
                            $(".main_lbj").hide();
                            switch (result1){
                                case 1:
                                    $(".alert").show();
                                    $(".jiutopimg").eq(1).addClass("none")
                                    $(".huihe_success").show();
                                    setTimeout(function () {
                                        console.log("跳转")
                                        window.location.href="doing.html"
                                    },3000);
                                    break;
                                case -1:
                                    $(".alert").show();
                                    $(".jiubottom img").eq(1).addClass("none")
                                    $(".huihe_lose").show();
                                    setTimeout(function () {
                                        console.log("跳转")
                                        window.location.href="doing.html"
                                    },3000);
                                    break;
                                case 0:
                                    location.reload();
                                    break;

                            }
                        },3000);
                    }



                    if (data.m=="outGame"){
                        clearInterval(tim3)
                        $(".jiubottom img").eq(0).addClass("none")
                        $(".play_center_cont").hide();
                        var myshoushi= data.my;
                        var fitshoushi=data.you;
                        donghua(fitshoushi,myshoushi);
                        setTimeout(function () {
                            $(".main_lbj").hide();
                            $(".alert").show();
                            $(".said_stop").show();
                            setTimeout(function () {
                                console.log("离开游戏");
                                window.location.href="index2.html";
                            },3000)
                        },4000)
                    }
                    if(data.m=="waitGame"){
                        clearInterval(tim3)
                        $(".jiutop img").eq(0).addClass("none");
                        var fdata=data.data;
                        $(".play_center_cont").hide();
                        $('.nowNum_pipei').html(fdata.desc);
                        var myshoushi= data.my;
                        var fitshoushi=data.you;
                        donghua(fitshoushi,myshoushi);
                        setTimeout(function () {
                            $(".main_lbj").hide();
                            $(".alert").show()
                            $(".said_success").show();
                        },4000)
                        setInterval(function(){
                            var sendData={};
                            sendData.m='Gametwo';
                            sendData.a='goon';
                            sendData.status=fdata.status;
                            sendData.uid=page_data.user.id;
                            sendData.roomid=localStorage.roomid;
                            ws.send(JSON.stringify(sendData));
                        },5000);
                    }
                    if(data.m=='goon'){
                        clearInterval(tim3)
                        //此处可以仿动画

                        setTimeout(function(){
                            console.log('轮询监听到')
                            window.location.href="doing.html"
                        },3000);
                    }
                    if(data.m=='reConnGo'){
                        console.log('----断线重连跳转执行了')
                        setTimeout(function(){
                            window.location.href=data.page;
                        },1500);

                    }

                };
                ws.onerror = function (msg) {
                    console.log('-------连接出错啦------');
                };
                ws.onclose = function (msg) {
                    console.log('关闭连接');
                };
            }
            catch (ex) {
                console.log(ex);
            }
        }
        function reConnect(){
            //记录断线重连状态  在重连之后置空
            console.log('app触发断线重连功能');
            localStorage.reConn=1;
            sendConn=1;
            init();
        }
        function send(msg) {
            try {
                ws.send(msg);
            } catch (ex) {
                console.log(ex);
            }
        }
        //刷新或关闭
        window.onbeforeunload = function () {
            try {
                //ws.send("loginout:{$data.vsuser.id}-1");
                ws.close();
                ws = null;
            }
            catch (ex) {
                console.log(ex);
            }
        };
        function begin(){
            //clearInterval(tim1);//停止计时
            //通知服务器所选游戏类型
            var zonghe=parseInt($("#game_p_z").val())+parseInt($("#game_p_y").val());
            if((zonghe+10)<$("#game_p_num").val()||zonghe>$("#game_p_num").val())
            {

                $("#tishi").show()
                $("#tishi").html("这也能选？");
                setTimeout(function () {
                    $("#tishi").hide()
                },2000)
                return false;
            }
            state_begin=1;
            console.log('begin'+state_begin);
            $(".ant_right").hide()
            $("#queding").hide()
            var sendData={};
            var gamedata={"left":$("#game_p_z").val(),"right":$("#game_p_y").val(),"shout":$("#game_p_num").val()};
            sendData.m='Gametri';
            sendData.a='gameTri';
            sendData.uid=page_data.user.id;
            sendData.roomid=localStorage.roomid;
            sendData.gamedata=gamedata
//            sendData.gamedata="left:"+$("#game_p_z").val()+","+"right:"+$("#game_p_y").val();
            ws.send(JSON.stringify(sendData))
            $("#pdiv").hide()
            console.log(sendData)
            resend= setTimeout(  resendxunhuan,2500)
            resendxunhuan=  setInterval(function () {
                var sendData={};
                sendData.m='Gametri';
                sendData.a='confData';
                sendData.uid=page_data.user.id;
                sendData.roomid=localStorage.roomid;
                sendData.gamedata=$("#game_p").val();
                ws.send(JSON.stringify(sendData));
                console.log(sendData);

            },2000)
            tim3=setInterval(function () {
                $(".main_dao").show()
                var sendData={};
                sendData.m='Gametri';
                sendData.a='timeup';
                sendData.uid=page_data.user.id;
                sendData.roomid=localStorage.roomid
                sendData.gamedata=$("#game_p").val();
                ws.send(JSON.stringify(sendData))
                console.log("超时信息已发送11111")
//                    console.log(miaoshu)
            },5000)

//	ws.close();
        }
    </script>
</head>

<body class="game_bg">
    <header class="mui-bar mui-bar-nav ">
        <a href="index.php" class="mui-icon-undo mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title" id="page_title">{$data.page_title}</h1>
    </header>

    <audio id="bgMusic" autoplay="autoplay">


    </audio>
    <!--音频-->
    <div class="f14">
        <div class="game_box mui-text-center aui-color-white" style="margin-top:30vh;">
            <div class="f30 line-height-2 re"><b id="miao">10</b>s</div>
            <div>请选择</div>
            <div class="game_shoushi flex" style="justify-content:center;">
                <div class="double" onclick="zuoshou(0)" id="zuoshou0"><img class="aui-col-10 blue active" src="images/game_shitou.png" alt=""></div>
                <div class="double" onclick="zuoshou(5)" id="zuoshou5"><img class="aui-col-10 blue" src="images/game_bu.png" alt=""></div>
                <div class="double" onclick="youshou(0)" id="yuoshou0" style="margin-left:15px;"><img class="aui-col-10 yellow active2" src="images/game_shitou.png" alt=""></div>
                <div class="double" onclick="youshou(5)" id="youshou5"><img class="aui-col-10 yellow" src="images/game_bu.png" alt=""></div>
            </div>
            <div class="aui-mar-t-10">请你喊出</div>
            <div class="shiwu_bar auto flex aui-pad-5">
                <div class="f1 active" onclick="xuanze(0)" id="xuanze0">没有</div>
                <div class="f1" onclick="xuanze(5)" id="xuanze5">五</div>
                <div class="f1" onclick="xuanze(10)" id="xuanze10">十</div>
                <div class="f1" onclick="xuanze(15)" id="xuanze15">十五</div>
                <div class="f1" onclick="xuanze(20)" id="xuanze20">二十</div>
            </div>
            <div id="queding" onclick="begin()" class="aui-pad-10">确定</div>
        </div>

        <!--动画-->

        <input type="hidden" value="0" id="game_content" />
        <input type="hidden" value="0" id="vscontent" />
        <input type="hidden" value="0" id="game_p_z" />
        <input type="hidden" value="0" id="game_p_y" />
        <input type="hidden" value="0" id="game_p_num" />
        <input type="hidden" id="data_id" value="{$data.deal_id}"/>
        <script>
            //左手0 5
            function zuoshou(num){
                $("#game_p_z").val(num);
//                $("#zuoshou0").attr("class","");
//                $("#zuoshou5").attr("class","");
//                $("#zuoshou"+num).attr("class","shiwu_ant");
            }
            //右手0 5
            function youshou(num){
                $("#game_p_y").val(num);
//                $("#youshou0").attr("class","");
//                $("#youshou5").attr("class","");
//                $("#youshou"+num).attr("class","shiwu_ant");
            }
            <!--没有0 五5 十10 十五15 二十20-->
            function xuanze(num){
                $("#game_p_num").val(num);

//                $(".shiwu_list_num").find('li').each(function(k,v){
//                    $(v).attr("class","");
//                });
//                $("#xuanze"+num).attr("class","shiwu_ant");
            }
            //提交
            function p(){
                $('#pdiv').hide();
                var val=$("#game_content").val($("#game_p_z").val()+"|"+$("#game_p_y").val()+"|"+$("#game_p_num").val());
                var data_id=$("#data_id").val();
                send("gamecontent:{$data.vsuser.id}-"+$("#game_content").val());

                if($("#game_content").val()!=0 && $("#vscontent").val()!=0){
                    $("#content2").hide();
                    $("#content3").show(function(){
                        fun("点击按钮进入结果");
                    });
                }
            }
            function dumiao(txt){
                console.log("dumiao:"+txt);
                //读秒前重置出拳
                $("#miao").html(30)
                $("#game_content").val(0);
                $("#vscontent").val(0);
                zuoshou(0);
                youshou(0);
                xuanze(0);

                $('#pdiv').show();
                var tim2=setInterval(function (){
                    var num=$("#miao").html();
                    num--;
                    $("#miao").html(num);
                    if(num==1){
                        $('#pdiv').hide();
                    }
                    if(num==0){
                        clearInterval(tim2);

                        //时间到 跳转结果
                        $("#content2").hide();
                        $("#content3").show(function(){
                        });
                        if (state_begin==0){
                            zuoshou(0);
                            youshou(0);
                            xuanze(0);
                            begin();
                        }
                        else
                        {
                            state_begin=0;
                        }
                    }
                    if(num<0){
//					clearInterval(tim2);
                    }
                },1000);
            }dumiao("非单页应用")
        </script>


        <!--对方-->
        <div class="fix aui-col-10" style="top:60px;">
            <div class="duifang_bar re">
                <div><b class="vuser_name">司马懿</b></div> <span class="f12">ID:999</span>
                <img class="user_tx ab aui-border-rasius-y vt" style="left:-30px;top:0;width:60px;height:60px;" src="image/avatar.png" alt="" >
            </div>
            <div class="flex">
                <div class="userid_bg f4 aui-pad-10 f12 flex">
                    <div>段位:<span></span></div>
                    <div>胜率:<span></span></div>
                    <div>人气:</div>
                    <div>连胜:</div>
                </div>
                <div class="game_jiu duifang_jiu f1 flex" style="white-space: nowrap;">
                    <img class="block aui-mar-l-5" src="images/game_jiu2.png" alt="" width="30">
                    <img class="block aui-mar-l-5" src="images/game_jiu2.png" alt="" width="30">
                </div>
            </div>
            <div class="game_voice_dui ab none">我出了布</div>
        </div>
        <!--己方-->
        <div class="fix aui-col-10"  style="bottom:0px;">
            <div class="game_voice re none">我出了石头</div>
            <div class="flex">
                <div class="game_jiu f1 flex" style="white-space: nowrap;">
                    <img class="block aui-mar-l-5" src="images/game_jiu2.png" alt="" width="30">
                    <img class="block aui-mar-l-5" src="images/game_jiu2.png" alt="" width="30">
                </div>
                <div class="userid_bg f12 aui-pad-10 f4 flex">
                    <div>段位:</div>
                    <div>胜率:</div>
                    <div>人气:</div>
                    <div>连胜:</div>
                </div>
            </div>
            <div class="jifang_bar re mui-text-right">
                <div><b class="my_name">司马懿</b></div> <span class="f12 ">ID: <span class="my_id">999</span> </span>
                <img class="user_tx ab aui-border-rasius-y mt" style="right:-30px;bottom:0;border-color:#ff8596;width:60px;height:60px;" src="image/avatar.png" alt="" width="60">
            </div>
            <div class="pipei_box aui-color-white mui-text-center re" style="background:#2e1303;font:8px/12px '微软雅黑';">
                <div class="mutai"></div>
                <!--<div class="zhunbei ab f14">准备开始</div>-->

                <div class="flex" style="height:40px;padding-top:10px;">
                    <div class="f5 hidden re" style="height:50px;overflow-x:auto;">
                        <div class="kongwei duchuang flex ab" style="overflow-x:auto;">
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                            <div><img class="block auto" src="images/bx_kong.png" alt="" width="22"><div>空位</div></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

<!--十五二十动画-->
    <div class="main_lbj">
    <div class="df_shoushi ab mui-text-center none">
        <div id="duimian_zi" class="f24 aui-color-white" style="transform: rotate(180deg);">一条龙</div>
        <img id="duimian_tu1" src="images/animate_shiwu0.p" alt="">
        <img id="duimian_tu2" src="images/animate_wu.png" alt="">
    </div>
    <div class="jf_shoushi ab mui-text-center none">
        <div id="my_zi" class="f24 aui-color-white">一条龙</div>
        <img id="my_tu1" src="images/animate_shi.png" alt="">
        <img id="my_tu2" src="images/animate_wu.png" alt="">
    </div>
    </div>


    <script>
        function  donghua(you,my) {
            console.log("你的")
            $(".game_box").hide();
            console.log(parseInt(you.left));
            switch (parseInt(you.shout)){
                case 0:
                    $("#duimian_zi").html("没有");
                    break;
                case 5:
                    $("#duimian_zi").html("五");
                    console.log(5)
                    break;
                case 10:
                    $("#duimian_zi").html("十");
                    break;
                case 15:
                    $("#duimian_zi").html("十五");
                    break;
                case 20:
                    $("#duimian_zi").html("二十");
                    break;
            }
            switch (parseInt(my.shout)){
                case 0:
                    $("#my_zi").html("没有");
                    $("#bgMusic ").attr("src","radio/meiyou.mp3");
                    var  a= $("#bgMusic")[0];
                    a.play()
                    break;
                case 5:
                    $("#my_zi").html("五");
                    $("#bgMusic ").attr("src","radio/wu.mp3");
                    var  a= $("#bgMusic")[0];
                    a.play()
                    break;
                case 10:
                    $("#my_zi").html("十");
                    $("#bgMusic ").attr("src","radio/shi.mp3");
                    var  a= $("#bgMusic")[0];
                    a.play()
                    break;
                case 15:
                    $("#my_zi").html("十五");
                    $("#bgMusic ").attr("src","radio/shiwu.mp3");
                    var  a= $("#bgMusic")[0];
                    a.play()
                    break;
                case 20:
                    $("#my_zi").html("二十");
                    $("#bgMusic ").attr("src","radio/ershi.mp3");
                    var  a= $("#bgMusic")[0];
                    a.play()
                    break;
            }
//            $("#duimian_zi").show();
//            $("#my_zi").show()

            $(".df_shoushi #duimian_tu1").attr("src","images/animate_shiwu"+you.left+".png");
            $(".df_shoushi #duimian_tu2").attr("src","images/animate_shiwu"+you.right+".png");
            $(".jf_shoushi #my_tu1").attr("src","images/animate_shiwu"+my.left+".png");
            $(".jf_shoushi #my_tu2").attr("src","images/animate_shiwu"+my.right+".png");

            $(".df_shoushi").show()
            $(".jf_shoushi").show()

        }
    </script>
<!--alert-->
    <!--闯关奖品-->
    <div class="pass_alert fix aui-pad-10 mui-text-center aui-color-white flex">
        <div class="pass_num">第一关</div>
        <div class="f12"><img class="aui-col-10" src="images/mx_1关.png" alt=""><div>10元充值卡</div></div>
        <img class="pass_close ab reri retop" style="filter:brightness(2);" src="images/close.png" alt="" width="16">
    </div>
    <!--语音聊天-->
    <div class="game_msg fix">
        <img class="game_chat" src="images/game_chat.png" alt="" width="40">
        <img class="game_yuyin" src="images/game_voice.png" alt="" width="40">
        <div class="speak f12 ab none">
            <div>你好,很高兴和你玩！</div>
            <div>快点出吧,等着花儿都谢了！</div>
            <div>你太会玩了！</div>
            <div>兄弟,认真一点,行吗？</div>
            <div>怎么又断线了,网络怎么这么差啊？</div>
        </div>
    </div>

    <!--游戏结果动画-->
    <div class="alert f14  none ">


        <!--回合胜利-->
        <div class="saiduan_succ  huihe_success box mui-text-center re aui-pad-20 re none" style="top:10vh;">
            <img class="game_light light ab block" style="width:130%;left:-15%;top:-25vh;opacity:0.7;z-index:-1;" src="images/game_light.png" alt=" ">
            <img class="ab aui-border-rasius-y aui-col-10 auto" style="top:-40px;left:0;right:0;" src="images/game_pass_succ1.png" alt="">
            <div>
                <img class="mt" src="image/avatar.png" alt="" width="60">
                <div class="aui-mar-t-10"><b>第 <span class="huihe_num"></span> 回合</b><img class="block auto vmid" src="images/shuaxin.gif" alt="" width="20"></div>
                <div class="aui-mar-t-5">下一回合游戏马上开始</div>
            </div>
        </div>

        <!--回合失败-->
        <div class="xiaoduan_succ huihe_lose box mui-text-center re aui-pad-20 re none" style="top:10vh;">
            <img class="ab aui-col-6 auto" style="top:-60px;left:0;right:0;" src="images/game_pass_fail.png" alt="">
            <div>
                <img class="mt" src="image/avatar.png" alt="" width="60">
                <div class="aui-mar-t-10"><b>第 <span class="huihe_num"></span> 回合</b><img class="block auto vmid" src="images/shuaxin.gif" alt="" width="20"></div>
                <div class="aui-mar-t-5">下一回合游戏马上开始</div>
            </div>
        </div>

        <!--赛段胜利 2次匹配-->
        <div class="saiduan_succ said_success box mui-text-center re aui-pad-20 re none" style="top:10vh;">
            <img class="game_light light ab block" style="width:130%;left:-15%;top:-25vh;opacity:0.7;z-index:-1;" src="images/game_light.png" alt=" ">
            <img class="ab aui-border-rasius-y aui-col-10 auto" style="top:-40px;left:0;right:0;" src="images/game_pass_succ2.png" alt="">
            <div>
                <img class="mt" src="image/avatar.png" alt="" width="60">
                <div class="aui-mar-t-10"><b>正在匹配</b><img class="block auto vmid" src="images/shuaxin.gif" alt="" width="20"></div>
                <div class="aui-mar-t-5"><div class="nowNum_pipei"></div>赛段 马上开始</div>
            </div>
        </div>

        <!--赛段失败 -->
        <div class="xiaoduan_succ said_stop box mui-text-center re aui-pad-20 re  none " style="top:10vh;">
            <img class="ab aui-col-9 auto" style="top:-60px;left:0;right:0;" src="images/game_pass_fail2.png" alt="">
            <img class="aui-mar-t-20 aui-border-rasius-y mt" style="border:7px solid #ff8596;" src="image/avatar.png" alt="" width="80">
            <div><div id="gameout">-100积分</div><div>请您再接再励，重新来过</div></div>
        </div>

        <!--最终胜利-->
        <div class="xiaoduan_succ last_success box mui-text-center re aui-pad-20 re none" style="top:10vh;">
            <img class="ab" style="width:130%;left:-15%;top:-25vh;opacity:0.7;z-index:-1;" src="images/game_light.png" alt="">
            <img class="ab aui-border-rasius-y aui-col-10 auto" style="top:-40px;left:0;right:0;" src="images/game_pass_succ.png" alt="">
            <div>
                <img class="mt" src="image/avatar.png" alt="" width="60">

                <div id="gamewin">
                    <div class="aui-border-radius-30 aui-bg-deepyellow aui-col-4 auto f12" style="margin-bottom:5px;"><img class="vmid aui-mar-r-5" src="images/xing.png" alt="" width="15"><span>+999</span></div>
                    <div class="aui-border-radius-30 aui-bg-deepyellow aui-col-4 auto f12"><img class="vmid aui-mar-r-5" src="images/zuan.png" alt="" width="15"><span>+999</span></div>
                </div>
            </div>
        </div>
    </div>

</body>
<script src="js/game.js"></script>

</html>